// 全局设置  Jquery 请求为同步
$.ajaxSetup({
    async: false
});

// 渲染分类标题
(function () {
    $.get('http://chst.vip:1234/api/getcategorytitle', (res) => {
        console.log(res);
        let result = res.result
        let ele = ''
        result.forEach(item => {
            ele += `
                <div class="panel-default">
                    <div class="panel-heading">
                        <h4 class="panel-title">
                            <a class="titleid" titleId="${item.titleId}" href="javascript:;">
                                <span>${item.title}</span>
                                <i class="fr">▼</i>
                            </a>
                        </h4>
                    </div>
                    <div class="collapseOne">
                        <div class="panel-body">
                            <div class="container">
                                <div class="row">
                                    <div class="coll">
                                        <a href="">2</a>
                                    </div>
                                    <div class="coll">
                                        <a href="">2</a>
                                    </div>
                                    <div class="coll">
                                        <a href="">2</a>
                                    </div>
                                    <div class="coll">
                                        <a href="">2</a>
                                    </div>
                                    <div class="coll">
                                        <a href="">2</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>`
        });
        $('#tablist').html(ele)
    })
})();

// 渲染标题对应的分类
(function () {
    $('#tablist .titleid').each(function (i, item) {
        fetch('http://chst.vip:1234/api/getcategory?titleid=' + $(this).attr('titleId'))
            .then(response => {
                return response.json()
            }).then(data => {
                let res = data.result
                // console.log(res);
                let el = ''
                res.forEach(item => {
                    el += `
                    <div class="coll">
                        <a href="bijia.html?categoryid=${item.categoryId}">${item.category}</a>
                    </div>`
                });
                $('.row').eq(i).html(el)
            });
    })
})();

// 实现抽屉效果
(function () {
    $('#tablist').find('.collapseOne').slideUp(0)
    $('#tablist').on('click', '.panel-heading', function () {
        // console.log(22);
        $(this).siblings('.collapseOne').stop().slideToggle().parents('.panel-default').siblings('.panel-default').find('.collapseOne').slideUp()
    })
})();

